<template>
	<view class="container">
		<view class="userInfo">
			<image :src="dataList.userImg" mode=""></image>
			<view class="username">{{dataList.userName}}</view>
		</view>
		<view class="price">
			<view class="price-num">￥{{dataList.tradingMoney}}</view>
			<view class="guidance">官方指导价格:￥{{dataList.referenceMoney}}</view>
		</view>
		<view class="title">{{dataList.tradingTitle}}</view>
		<view class="type">
			<view class="left">发布类型:</view>
			<view class="right" v-if="dataList.tradingType==0">积分</view>
			<view class="right" v-if="dataList.tradingType==1">CGC</view>
		</view>
		<view class="type">
			<view class="left">数量:</view>
			<view class="right">{{dataList.tradingNum}}</view>
		</view>
		<view class="button" v-if="id!=dataList.userId">
			<view class="want" @click="want">我想要</view>
			<view class="buy" @click="buy">立即购买</view>
		</view>
	</view>
</template>

<script>
	import {setcgc,buycgc} from "../../../api/index.js"
	export default{
		data(){
			return{
				dataList:'',
				id:""
			}
		},
		onLoad(e) {
			this.id=uni.getStorageSync("userInfo").userId
			this.dataList=JSON.parse(e.item)
			
			console.log(this.dataList)
		},
		methods:{
			want(){
				this.get(setcgc,{
					tradingMarketId:this.dataList.tradingMarketId,
					type:1
				}).then(res=>{
					let name=this.dataList.userName
					if(name==null){
						name="昵称未设置"
					}
					let id=this.dataList.userId
					uni.navigateTo({
						url:"/pages/chat/chatdetails?id="+id+"&name="+name+"&cgc="+JSON.stringify(this.dataList)
					})
					console.log(res)
				})
			},
			buy(){
				this.showMd('确认购买',()=>{
					this.get(buycgc,{tradingMarketId:this.dataList.tradingMarketId}).then(res=>{
						uni.navigateTo({
							url:'../cgcpay?id='+res.data+"&price="+this.dataList.tradingMoney
						})
					})
				})
			}
		}
	}
</script>

<style lang="less">
	.container{
		padding: 30rpx;
	}
	.userInfo{
		display: flex;
		width: 690rpx;
		align-items: center;
		image{
			width: 70rpx;
			height: 70rpx;
			border-radius: 50%;
			margin-right: 20rpx;
		}
		
	}
	.username{
		font-size: 32rpx;
		font-weight: bold;
		color: #333333;
	}
	.price{
		display: flex;
		align-items: center;
		width: 690rpx;
		margin-top: 20rpx;
	}
	.price-num{
		font-size: 32rpx;
		font-weight: bold;
		color: #F09238;
	}
	.guidance{
		// width: 230rpx;
		height: 34rpx;
		background: #F8F8F8;
		border-radius: 8rpx;
		margin-left: 10rpx;
		font-size: 24rpx;
		color: #666666;
	}
	.title{
		margin-top: 20rpx;
		font-size: 30rpx;
		font-weight: bold;
		color: #333333;
	}
	.type{
		display: flex;
		align-items: center;
		margin-top: 30rpx;
		.left{
			font-size: 26rpx;
			font-weight: 400;
			color: #333333;
			margin-right: 30rpx;
		}
		.right{
			font-size: 30rpx;
			font-weight: bold;
			color: #F09238;
		}
	}
	.button{
		display: flex;
		align-items: center;
		position: fixed;
		bottom: 60rpx;
		width: 690rpx;
		padding: 0 30rpx;
		justify-content: space-between;
		.want{
			width: 300rpx;
			height: 70rpx;
			border: 1px solid #F09238;
			border-radius: 35rpx;
			text-align: center;
			line-height: 70rpx;
			font-size: 28rpx;
			color: #F09238;
		}
		.buy{
			width: 300rpx;
			height: 70rpx;
			background: linear-gradient(180deg, #F09238 0%, #EC5F2A 100%);
			border-radius: 35rpx;
			font-size: 28rpx;
			line-height: 70rpx;
			text-align: center;
			color: #FFFFFF;
		}
	}
</style>
